<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    {include file="public/static" /}
    <link rel="stylesheet" href="__components__/eleTree/eleTree.css" media="all">
    <style>
        .menu-left{
            width: 14%;
            float: left;
            padding: 10px 5px;
            background-color: #fff;
            box-shadow: 2px 2px 2px #888888;
            overflow: auto;
        }
        .layui-col-space15{
            width: 85%;
            float: right;
        }
        .ele5{
            min-width: 90%;
            z-index: 9999;
        }
    </style>
</head>
<body>

{include file="public/nav" /}

<div class="layui-fluid">
    <!-- 左侧菜单 -->
    <div class="menu-left">
        <div class="eleTree ele2" lay-filter="data2"></div>
    </div>
    <!-- 右侧列表 -->
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5" >
                        <input type="hidden" readonly id="classifyId" name="classifyId" value="{$Request.param.classifyId}"/>
                        <div class="layui-inline layui-show-xs-block" >
                            <input type="text" name="title" placeholder="标题" autocomplete="off" class="layui-input" value="{$Request.param.title}"/>
                        </div>
<!--                        <div class="layui-inline" >-->
<!--                            <input type="hidden" readonly id="classifyId" name="classifyId"/>-->
<!--                            <input type="text" readonly name="classify" placeholder="选择分类" autocomplete="off" class="layui-input" value="{$Request.param.classify}" />-->
<!--                            <div class="eleTree ele5" lay-filter="data5"></div>-->
<!--                        </div>-->
                        <div class="layui-inline" style="width: 80px;">
                            <select name="status" id="status">
                                <option value="">状态</option>
                                <option value="1" {eq name="Request.param.status" value="1"} selected {/eq}>启用</option>
                                <option value="0" {eq name="Request.param.status" value="0"} selected {/eq}>禁用</option>
                            </select>
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <button class="layui-btn"  lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i>搜索</button>
                            <a href="{:url('Article/articleList')}">
                                <button type="button" class="layui-btn"><i class="layui-icon">&#xe639;</i>清空</button>
                            </a>
                        </div>
                    </form>
                </div>
                <div class="layui-card-header">
                    {eq name="check.ArticlearticleAdd" value="1"}
                        <button class="layui-btn" onclick="common.openWindow('新增文章','{:url('Article/articleAdd')}','750','')">
                            <i class="layui-icon">&#xe654;</i>新增文章
                        </button>
                    {/eq}
                </div>
                <div class="layui-card-body layui-table-body">
                    <table class="layui-table layui-form">
                        <thead>
                            <tr>
                                <th>封面</th>
                                <th>标题</th>
                                <th min-width="60">所属分类</th>
                                <th>发布人</th>
                                <th>发布时间</th>
                                <th>排序</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            {volist name="info" id="vo"}
                                <tr>
                                    <td>
                                        <a href="__upload__/{$vo.ar_image}" target="_blank">
                                            <img src="__upload__/{$vo.ar_image}" width="55" height="40">
                                        </a>
                                    </td>
                                    <td>{$vo.ar_title}</td>
                                    <td>
                                        {volist name="vo.classify" id="v"}
                                            <span class="layui-badge layui-bg-green">{$v.ac_title}</span>
                                        {/volist}
                                    </td>
                                    <td>{$vo.ad_name}</td>
                                    <td>{$vo.ar_time|date='Y-m-d H:i:s'}</td>
                                    <td>{$vo.ar_sort}</td>
                                    <td>
                                        {eq name="vo.ar_status" value="1"}
                                            <span class="layui-badge layui-bg-green">启用</span>
                                        {else/}
                                            <span class="layui-badge">禁用</span>
                                        {/eq}
                                    </td>
                                    <td class="td-manage">
                                        {eq name="check.ArticlearticleEdit" value="1"}
                                            <a href="javascript:;" onclick="common.openWindow('编辑文章','{:url('Article/articleEdit',['id'=>$vo.ar_id])}','750','')" >
                                                <i class="layui-icon">&#xe642;</i>编辑
                                            </a>
                                        {/eq}
                                        {eq name="check.ArticlearticleDel" value="1"}
                                            <a href="javascript:;" onclick="dataDel(this,'{$vo.ar_id}')" >
                                                <i class="layui-icon">&#xe640;</i>删除
                                            </a>
                                        {/eq}
                                    </td>
                                </tr>
                            {/volist}
                        </tbody>
                    </table>
                </div>
                <div class="layui-card-body ">
                    <div class="page">
                        {$info|raw}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    /**全选*/
    common.selectCheckbox('checkbox','id[]');
    /**树形组件获取分类列表*/
    const list = common.getTreeMenuList("{:url('Article/getClassify')}");
    /**获取已选分类id值*/
    const selectedId = $("#classifyId").val();
    /**显示分类树状菜单*/
    const info = {className:".ele2", nodeClick:"data2",inputId:"#classifyId", multipleChoice:true, selectedId:selectedId.split(","), checkStrictly: true};
    common.treeMenuShow(list, info);
    /**删除*/
    function dataDel(obj,id){
        layer.confirm('确认要删除这条数据吗？',function(){
            var index = layer.load();
            //发异步删除数据
            $.ajax({
               type:"post",
               url:"{:url('Article/articleDel')}",
               data:{id:id},
               dataType:'json',
               success:function (data) {
                   if(data.status === 1){
                       $(obj).parents("tr").remove();
                       layer.msg(data.info, {icon: 6,time:1500});
                   }else{
                       layer.msg(data.info, {icon: 5,time:1500});
                   }
                   layer.close(index);

               },
               error:function (data) {
                   console.log(data);
                   layer.msg("不好意思，出现了一点问题", {icon: 5});
               }
            });
        });
    }
</script>
</html>